[material-ui][Chip] Add slots and slotProps #46098
Conversation
sai6855
added
component: chip
Netlify deploy previewhttps://deploy-preview-46098--material-ui.netlify.app/ @mui/material/Chip: parsed: +2.15% , gzip: +2.04% Bundle size reportDetails of bundle changes (Toolpad) |
| }, | ||
| ownerState, | ||
| ref: handleRef, | ||
| shouldForwardComponentProp: true, |
There was a problem hiding this comment.
| shouldForwardComponentProp: true, |
ChipRoot comes from div, no need to forward component prop
There was a problem hiding this comment.
The component prop was forwarded because, when shouldForwardComponentProp is set to false, the component prop returned from useSlot('root') gets removed in the useSlot.ts file and replaced with the as prop here.
While this behavior works fine for components that do not rely on component-specific logic, it breaks components like Chip, which access the component prop directly in their logic — for example, this line. Removing the component prop in such cases causes test failures.
To fix this, I added shouldForwardComponentProp: true to ensure that the component prop is preserved and Chip continues to behave correctly.
There was a problem hiding this comment.
Got it. Can you add a comment above the line shouldForwardComponentProp.
There was a problem hiding this comment.
done, added here 29b9ea4
|
@sai6855 Can you check the CIs? Some are failing. |
| label: { | ||
| expectedClassName: classes.label, | ||
| }, | ||
| }, |
There was a problem hiding this comment.
Given the comment about the shouldForwardComponentProp. I think we need to add more tests.
- With
clickable: trueand a customcomponentprop.
There was a problem hiding this comment.
material-ui/packages/mui-material/src/Chip/Chip.test.js
Lines 83 to 88 in 4cfd2f7
This PR adds slots and slotProps to Chip component